<template>
  <div style="width: 100%; height: 100%; margin-bottom: 10px">
    <el-row>
      <el-button
        size="mini"
        icon="el-icon-refresh-left"
        plain
        type="primary"
        @click="GetDBList()"
        >刷新</el-button
      >
      <el-button
        plain
        size="mini"
        type="warning"
        icon="el-icon-download"
        @click="SaveDBList()"
        >保存服务端数据库配置文件</el-button
      >
      <el-button
        plain
        size="mini"
        type="danger"
        icon="el-icon-refresh"
        @click="RefreshDBList()"
        >刷新服务端数据库配置</el-button
      >
      <el-button
        plain
        size="mini"
        type="danger"
        icon="el-icon-refresh"
        @click="InitDataBaseToDB()"
        >获取数据库结构</el-button
      >
    </el-row>
    <div style="height: 15px"></div>
    <el-row>
      <el-button
        icon="el-icon-circle-plus-outline"
        plain
        size="mini"
        type="success"
        @click="ShowDBAdd()"
        >增加数据库连接</el-button
      >
      <el-dialog
        title="增加数据库连接"
        v-model="FShowDBAdd"
        :append-to-body="true"
        :close-on-click-modal="false"
        width="60%"
        destroy-on-close
      >
        <table border="1">
          <colgroup>
            <col style="width: 16rem; max-width: 16rem" />
            <col style="width: 32rem" />
            <col style="width: 16rem; max-width: 16rem" />
            <col style="width: 32rem" />
            <col style="width: 16rem; max-width: 16rem" />
            <col style="width: 32rem" />
          </colgroup>
          <tbody>
            <tr>
              <td class="title">
                <span style="color: red"> * </span>数据库代码
              </td>
              <td>
                <el-input
                  placeholder="必需的,且唯一"
                  v-model="FDBNew.dbCode"
                ></el-input>
              </td>
              <td class="title">
                <span style="color: red"> * </span>数据库类型
              </td>
              <td>
                <el-select v-model="FDBNew.dbType" placeholder="请选择">
                  <el-option
                    v-for="item in FDBTypeList"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  >
                    <span style="float: left">{{ item.label }}</span>
                    <span
                      style="float: right; color: #8492a6; font-size: 13px"
                      >{{ item.value }}</span
                    >
                  </el-option>
                </el-select>
              </td>
              <td class="title">
                <span style="color: red"> * </span>数据库版本
              </td>
              <td>
                <el-input v-model="FDBNew.dbVersin"></el-input>
              </td>
            </tr>
            <tr>
              <td class="title">连接字符串</td>
              <td colspan="5">
                <el-input v-model="FDBNew.connectionString"></el-input>
              </td>
            </tr>
            <tr>
              <td class="title">备注</td>
              <td colspan="5">
                <el-input v-model="FDBNew.remark"></el-input>
              </td>
            </tr>
          </tbody>
        </table>
        <template #footer>
          <span class="dialog-footer">
            <el-button @click="FShowDBAdd = false">取 消</el-button>
            <el-button type="primary" @click="AddDB()">确 定</el-button>
          </span>
        </template>
      </el-dialog>
    </el-row>
    <!-- 数据配置列表 -->
    <el-row style="margin-top: 5px; height: 300px">
      <el-table
        :data="FDBList"
        height="100%"
        style="width: 100%; overflow-y: auto"
      >
        <el-table-column prop="dbCode" label="数据库代码" width="180" fie>
        </el-table-column>
        <el-table-column prop="dbType" label="数据库类型" width="180">
        </el-table-column>
        <el-table-column prop="dbVersin" label="数据库版本" width="120">
        </el-table-column>
        <el-table-column label="主数据库" width="120">
          <template #default="scope">
            <el-switch :model-value="GetIsMain(scope.row)"> </el-switch>
          </template>
        </el-table-column>
        <el-table-column label="操作">
          <template #default="scope">
            <el-button
              plain
              type="primary"
              size="small"
              icon="el-icon-edit"
              @click="DBEdit(scope.$index, scope.row)"
              >编辑</el-button
            >
            <el-button
              plain
              type="primary"
              size="small"
              icon="el-icon-setting"
              @click="DBSetMain(scope.$index, scope.row)"
              >主账套</el-button
            >
            <el-button
              plain
              type="primary"
              size="small"
              icon="el-icon-s-data"
              @click="InitDBFirst(scope.$index, scope.row)"
              >框架表生成</el-button
            >
            <el-button
              plain
              type="primary"
              size="small"
              icon="el-icon-s-data"
              @click="onGetDataBaseObjectList(scope.row)"
              >表信息查看</el-button
            >
            <el-button
              plain
              size="small"
              type="danger"
              icon="el-icon-delete"
              @click="DBDelete(scope.$index, scope.row)"
              >删除</el-button
            >
          </template>
        </el-table-column>
      </el-table>
    </el-row>

    <div style="height: 25px"></div>
    <el-row>
      <el-button plain type="primary" @click="ShowZTAdd()"
        >增加账套【如果有主从库的概念,可以用此功能】</el-button
      >
      <el-dialog
        title="增加账套管理"
        v-model="FShowZTAdd"
        :append-to-body="true"
        :close-on-click-modal="false"
        width="60%"
      >
        <table border="1">
          <colgroup>
            <col style="width: 16rem; max-width: 16rem" />
            <col style="width: 32rem" />
            <col style="width: 16rem; max-width: 16rem" />
            <col style="width: 32rem" />
          </colgroup>
          <tbody>
            <tr>
              <td class="title"><span style="color: red"> * </span>账套代码</td>
              <td>
                <el-input
                  placeholder="必需的,且唯一"
                  v-model="FZTNew.ztCode"
                ></el-input>
              </td>
              <td class="title"><span style="color: red"> * </span>主数据库</td>
              <td>
                <el-select
                  v-model="FZTNew.masterDBCode"
                  placeholder="请选择数据库"
                  style="width: 100%"
                >
                  <el-option
                    v-for="item in FDBList"
                    :key="item.dbCode"
                    :label="item.dbCode"
                    :value="item.dbCode"
                  >
                    <span
                      tyle="float: right; color: #8492a6; font-size: 13px"
                      >{{ item.dbCode }}</span
                    >
                  </el-option>
                </el-select>
              </td>
            </tr>
            <tr>
              <td class="title">
                <span style="color: red"> * </span>辅助数据库
              </td>
              <td colspan="3">
                <el-select
                  v-model="FZTNew.slaveDBCodeList"
                  multiple
                  placeholder="请选择数据库"
                  style="width: 100%"
                >
                  <el-option
                    v-for="item in FDBList"
                    :key="item.dbCode"
                    :label="item.dbCode"
                    :value="item.dbCode"
                  >
                    <span
                      tyle="float: right; color: #8492a6; font-size: 13px"
                      >{{ item.dbCode }}</span
                    >
                  </el-option>
                </el-select>
              </td>
            </tr>
          </tbody>
        </table>
        <template #footer>
          <span class="dialog-footer">
            <el-button @click="FShowZTAdd = false">取 消</el-button>
            <el-button type="primary" @click="AddZT()">确 定</el-button>
          </span>
        </template>
      </el-dialog>
    </el-row>
    <!-- 账套配置列表 -->
    <el-row style="margin-top: 5px; height: 300px">
      <el-table
        :data="FZTList"
        height="100%"
        style="width: 100%; overflow-y: auto"
      >
        <el-table-column prop="ztCode" label="账套代码" width="180">
        </el-table-column>
        <el-table-column prop="masterDBCode" label="主数据库" width="180">
        </el-table-column>
        <el-table-column prop="slaveDBCodeList" label="从库"> </el-table-column>
        <el-table-column label="操作">
          <template #default="scope">
            <el-button size="mini" @click="ZTEdit(scope.$index, scope.row)"
              >编辑</el-button
            >
            <el-button size="mini" @click="ZTSetMain(scope.$index, scope.row)"
              >设置为主账套</el-button
            >
            <el-button
              size="mini"
              type="danger"
              @click="ZTDelete(scope.$index, scope.row)"
              >删除
            </el-button>
          </template>
        </el-table-column>
      </el-table>
    </el-row>
  </div>
</template>

<script  lang="ts">
import { constHelper, TDBHelper, TDBInfo, TZTInfo } from "@/baselib/module/BaseClass";
import { Options, Vue } from "vue-class-component";
import TDataBaseApi from "@/baselib/module/database/DataBaseApi";
import { IMenuItem } from "@/store";
//配合着用
@Options({})
export default class TFormModuleDB extends Vue {
  private FOpenData: boolean = false;
  private FShowDBAdd: boolean = false;
  private FShowZTAdd: boolean = false;
  private FDBNew: TDBInfo = new TDBInfo();
  private FZTNew: TZTInfo = new TZTInfo();
  private FDBHelper: TDBHelper = new TDBHelper();
  private FDBList: TDBInfo[] = [];
  private FZTList: TZTInfo[] = [];
  private FDBTypeList: any = constHelper.TMYDBType;
  public created() {
    this.GetDBList();
  }
  private GetIsMain(qRow: any) {
    return qRow.dbCode == this.FDBHelper.mainZTCode;
  }
  //
  private async GetDBList() {
    this.FOpenData = false;
    //
    let lResult = await this.$myModuleAPI.getDBList();
    if (!lResult.resultSuccess) {
      this.$myMsgHelp.msgDialog(lResult.resultMsg);
      return;
    }
    this.FDBHelper = lResult.resultData;
    this.FDBList = this.FDBHelper.dbList;
    this.FZTList = this.FDBHelper.ztList;
    this.FDBList.forEach((item) => {
      item.tempID = this.$myStrHelper.getGUID();
    });
    this.FZTList.forEach((item) => {
      item.tempID = this.$myStrHelper.getGUID();
    });
    this.FOpenData = true;
  }
  private ShowDBAdd() {
    if (!this.FOpenData) {
      this.$myMsgHelp.msgHintAutoClose("请先获取服务端数据库配置,方可操作");
      return;
    }
    this.FDBNew = new TDBInfo();
    this.FDBNew.tempID = this.$myStrHelper.getGUID();
    this.FShowDBAdd = true;
  }
  private AddDB() {
    if (this.$myStrHelper.stringIsEmpty(this.FDBNew.dbCode)) {
      this.$myMsgHelp.msgHintAutoClose("数据库代码不可为空");
      return;
    }
    if (this.$myStrHelper.stringIsEmpty(this.FDBNew.dbType)) {
      this.$myMsgHelp.msgHintAutoClose("数据库类型不可为空");
      return;
    }
    if (this.$myStrHelper.stringIsEmpty(this.FDBNew.connectionString)) {
      this.$myMsgHelp.msgHintAutoClose("数据库连接字符串不可为空");
      return;
    }
    var bNew = true;
    for (var i = 0; i < this.FDBList.length; i++) {
      if (this.FDBNew.tempID == this.FDBList[i].tempID) {
        bNew = false;
      }
      if (
        this.FDBNew.tempID != this.FDBList[i].tempID &&
        this.FDBNew.dbCode.toLowerCase() == this.FDBList[i].dbCode.toLowerCase()
      ) {
        this.$myMsgHelp.msgHintAutoClose(
          "数据库代码重复【" + this.FDBNew.dbCode + "】"
        );
        return;
      }
    }
    if (bNew) {
      this.FDBList.push(this.FDBNew);
    }
    this.FShowDBAdd = false;
  }
  private DBEdit(qIndex: number) {
    this.FDBNew = this.FDBList[qIndex];
    this.FShowDBAdd = true;
  }
  private DBSetMain(qIndex: any, qRow: any) {
    if (this.FZTList.length > 0) {
      this.$myMsgHelp.msgHintNotClose(
        "采用了高级账套用法，请用账套管理设置默认主账套"
      );
      return;
    }
    this.FDBHelper.mainZTCode = qRow.dbCode;
  }
  private async DBDelete(qIndex: any, qRow: any) {
    let lConfirm = await this.$myMsgHelp.msgDialogConfirm("确定删除此连接");
    if (!lConfirm) {
      return;
    }
    this.FDBList.splice(qIndex, 1);
  }
  private ShowZTAdd() {
    if (!this.FOpenData) {
      this.$myMsgHelp.msgHintAutoClose("请先获取服务端数据库配置,方可操作");
      return;
    }
    this.FZTNew = new TZTInfo();
    this.FZTNew.tempID = this.$myStrHelper.getGUID();
    this.FShowZTAdd = true;
  }
  private AddZT() {
    if (this.$myStrHelper.stringIsEmpty(this.FZTNew.ztCode)) {
      this.$myMsgHelp.msgHintAutoClose("账套代码不可为空");
      return;
    }
    if (this.$myStrHelper.stringIsEmpty(this.FZTNew.masterDBCode)) {
      this.$myMsgHelp.msgHintAutoClose("账套主数据库不可为空");
      return;
    }
    var bNew = true;
    for (var i = 0; i < this.FZTList.length; i++) {
      if (this.FZTNew.tempID == this.FZTList[i].tempID) {
        bNew = false;
      }
      if (
        this.FZTNew.tempID != this.FZTList[i].tempID &&
        this.FZTNew.ztCode.toLowerCase() == this.FZTList[i].ztCode.toLowerCase()
      ) {
        this.$myStrHelper.stringIsEmpty(
          "数据库代码重复【" + this.FZTNew.ztCode + "】"
        );
        return;
      }
    }
    if (bNew) {
      this.FZTList.push(this.FZTNew);
    }
    this.FShowZTAdd = false;
  }
  private ZTEdit(qIndex: any, qRow: any) {
    this.FZTNew = this.FZTList[qIndex];
    this.FShowZTAdd = true;
  }
  private ZTSetMain(qIndex: any, qRow: any) {
    this.FDBHelper.mainZTCode = qRow.ztCode;
  }
  private async ZTDelete(qIndex: any, qRow: any) {
    let lConfirm = await this.$myMsgHelp.msgDialogConfirm("确定删除此连接");
    if (!lConfirm) {
      return;
    }
    this.FZTList.splice(qIndex, 1);
  }
  private async SaveDBList() {
    if (!this.FOpenData) {
      this.$myMsgHelp.msgHintAutoClose("请先获取服务端数据库配置,方可操作");
      return;
    }
    let lResult = await this.$myModuleAPI.saveDBList(this.FDBHelper);
    if (!lResult.resultSuccess) {
      this.$myMsgHelp.msgHintNotClose(lResult.resultMsg);
      return;
    }
    this.$myMsgHelp.msgHintAutoClose("保存数据库配置成功");
  }
  private async RefreshDBList() {
    if (!this.FOpenData) {
      this.$myMsgHelp.msgHintAutoClose("请先获取服务端数据库配置,方可操作");
      return;
    }
    let lResult = await this.$myModuleAPI.refreshDBList();
    if (!lResult.resultSuccess) {
      this.$myMsgHelp.msgHintNotClose(lResult.resultMsg);
      return;
    }
    this.$myMsgHelp.msgHintAutoClose("刷新数据配置成功");
  }
  private async InitDBFirst(qIndex: any, qRow: any) {
    if (!this.FOpenData) {
      this.$myMsgHelp.msgHintAutoClose("请先获取服务端数据库配置,方可操作");
      return;
    }
    let lOK = await this.$myMsgHelp.msgDialogConfirm(
      "确定要在主账套生成配置库"
    );
    if (lOK) {
      let lDBCode = qRow.dbCode;
      let lResult = await this.$myModuleAPI.initDBFirst(lDBCode);
      if (!lResult.resultSuccess) {
        this.$myMsgHelp.msgHintNotClose(lResult.resultMsg);
        return;
      }
      this.$myMsgHelp.msgHintAutoClose("初始化成功");
    }
  }
  private async InitDataBaseToDB() {
    let lResult = await TDataBaseApi.InitDataBaseToDB();
    if (!lResult.resultSuccess) {
      this.$myMsgHelp.msgDialog(lResult.resultMsg);
      return;
    }
    this.$myMsgHelp.msgHintAutoClose(lResult.resultMsg);
  }
  private onGetDataBaseObjectList(qRow: TDBInfo) {
    //跳转到编辑界面
    let lTag: IMenuItem = {
      menuIndexName: "TFormDataBaseObjectList_" + qRow.dbCode,
      menuComponent: "TFormDataBaseObjectList",
      menuTitle: "数据库信息_" + qRow.dbCode,
      menuIcon: "",
      menuParams: { dbCode: qRow.dbCode }, //参数
      menuChildren: [],
    };
    this.$myEvenBus.addTag(lTag);
  }
}
</script>
<style scoped>
table {
  border-collapse: collapse;
}

table,
table tr td {
  border: 1px solid #ccc;
}

.title {
  background-color: #d9d9d9;
  padding-left: 10px;
}
</style>
